import $ from "jquery";
/**
 * 新版本
 * @param {Document} targetElem
 */
export function selectElementHelper(targetElem) {
  //监听Body的子孙的变更情况，一旦存在变更保证选中元素只有一个
  watchElement(
    $(targetElem).get(0),
    {
      childList: true,
      // subtree: true,
    },
    function () {
      //保证只有一个元素是 shirkhan_clicked_target
      let targets = $(targetElem).find(".shirkhan_clicked_target");
      let theFirst = targets[0];
      targets.removeClass("shirkhan_clicked_target");
      $(theFirst).addClass("shirkhan_clicked_target");

      //保证只有一个元素是 shirkhan_hover_target
      let hoverTargets = $(targetElem).find(".shirkhan_hover_target");
      let theFirstHover = hoverTargets[0];
      hoverTargets.removeClass("shirkhan_hover_target");
      $(theFirstHover).addClass("shirkhan_hover_target");
    }
  );

  //固定选中元素
  let target = undefined;

  $(targetElem).on("mouseover", function (e) {
    $(e.target).addClass("shirkhan_hover_target");
  });

  $(targetElem).on("mouseout", function (e) {
    $(e.target).removeClass("shirkhan_hover_target");
  });

  $(targetElem).on("click", function (e) {
    target = e.target;

    $(targetElem).removeClass("shirkhan_clicked_target");

    !$(target).is("body") &&
      $(targetElem)
        .find(".shirkhan_clicked_target")
        .removeClass("shirkhan_clicked_target");

    $(targetElem)
      .find(".shirkhan_hover_target")
      .removeClass("shirkhan_hover_target"); //以防万一

    !$(target).is("body") && $(target).addClass("shirkhan_clicked_target"); //放弃body级别处理
  });
}

/**
 * @param {Document} doc
 * @returns {HTMLLinkElement}
 */
export function createLink(href) {
  // <link rel="stylesheet" type="text/css" href="https://res.wx.qq.com/mpres/zh_CN/htmledition/comm_htmledition/style/widget/ueditor_new/themes/iframe4d3953.css">
  let link = document.createElement("link");
  link.setAttribute("rel", "stylesheet");
  link.setAttribute("type", "text/css");
  link.setAttribute("href", href);
  return link;
}

/**
 * @param {Document} doc
 * @returns {HTMLLinkElement}
 */
export function injectLink(doc, href) {
  // <link rel="stylesheet" type="text/css" href="https://res.wx.qq.com/mpres/zh_CN/htmledition/comm_htmledition/style/widget/ueditor_new/themes/iframe4d3953.css">
  let link = document.createElement("link");
  link.setAttribute("rel", "stylesheet");
  link.setAttribute("type", "text/css");
  link.setAttribute("href", href);
  $(doc).find("head").append(link);
}

/**
 *
 * @param {{ fontName:string, fontUrl:string }}
 * @returns Promise
 */
export function loadFont({ fontName, fontUrl }) {
  const font = new FontFace(fontName, `url(${fontUrl})`);
  return font.load();
}

/**
 *  植入字体
 * @param {String} fontName
 * @param {String} fontUrl
 * @param {Document} doc
 * @returns {Promise} fontPromise
 */
export function addFontToDoc(
  fontName = "uighurFont",
  fontUrl = "https://ws-static-cdn.subat.cn/public/ug/fonts/UKIJTuz_Regular/UKIJTuz_Regular.woff2",
  doc = undefined
) {
  const font = loadFont({ fontName, fontUrl });
  // doc ? doc.fonts.add(font) : document.fonts.add(font);
  return font;
}
/**
 *
 * @param {Node} target
 * @param {MutationObserverInit} observeOptions
 * @param {Function} callback
 */
export function watchElement(target, observeOptions, callback) {
  let mutObserve = new MutationObserver(callback);
  mutObserve.observe(target, observeOptions);
}

/**
 *
 * @param {Document} doc
 * @param {Function} callback
 */

export function onDocumentComplete(doc, callback) {
  doc.addEventListener("readystatechange", function (event) {
    if (doc.readyState === "complete") {
      callback && callback(event);
    }
  });
}
